<template>
  <div class="bg">
    <nav-com
      title="收货地址"
      :showView="true"
      @back="backHandler()"
    ></nav-com>
    <div class="list">
      <div
        class="box"
        v-for="item in dataList"
        :key="item.id"
      >
      <div @click="toSetAddress(item.id)">
        <div>{{item.consignee}} <span style="margin-left:20px">{{item.phone}}</span></div>
        <div class="address">{{item.province_name}}{{item.city_name}}{{item.area_name}}{{item.address}}</div>
      </div>

        <div class="bottom">
          <div @click="setDef(item.id)">
            <van-icon
              name="checked"
              color="#FE4B20"
              v-if='item.is_default == "1"'
            />
            <van-icon
              name="checked"
              color="#ccc"
              v-else
            />
            默认地址
          </div>
          <div>
            <span @click="edit(item)">
              <van-icon name="edit" /> 编辑
            </span>
            <span @click="deleteAddress(item.id)">
              <van-icon
                name="delete-o"
                style="margin-left:20px"
              /> 删除
            </span>

          </div>
        </div>
      </div>
    </div>
    <div
      class="button"
      @click="toAddAddress"
    >
      +新增收货地址
    </div>

  </div>
</template>

<script>
import goBackEntity from '@/utils/eventBus';
import navCom from "@/component/nav";
import { getReceiptList, delReceipt, setDefultReceipt } from "@/api/api";
import { Toast } from 'vant';
const config = {
  headers:{
    'Authorization': localStorage.getItem("token"),
    'token': localStorage.getItem("token")
  }
};

export default {
  components: {
    navCom,
  },
  data() {
    return {
      dataList: [],
    };
  },
  mounted() {
    this.initData();
  },
  methods: {
    toSetAddress(id){
      // localStorage.setItem("addressId",id);
      this.$wweixin.setItem("addressId",id)
      this.$router.go(-1)
      return
      goBackEntity.$emit('id',id)


    },
    setDef(id){
        setDefultReceipt({id}).then((res)=>{
            this.initData()
        })
    },
    backHandler() {
      this.$router.go(-1);
    },
    toAddAddress() {
      this.$router.push({ name: "addAddress", params: { isAdd: true } });
    },
    edit(item) {
      this.$router.push({ name: "addAddress", params: { detail: item } });
    },
    deleteAddress(id) {
      this.$dialog
        .alert({
          title: "删除地址",
          message: "亲，您确认要删除该地址吗？",
          confirmButtonText: "确定",
          showCancelButton: true,
          cancelButtonText: "取消",
        })
        .then(() => {
            delReceipt({id}).then((result) => {

            }).catch((err) => {

            });
          let urls = `${localStorage.getItem("share_weixin_shareurl")}/addons/shopro/address/del`
          this.$axios.post(urls,{id},config).then(res=>{
            Toast(res.data.msg)
            this.initData()
          }).catch((err) => {});
        });
    },
    initData() {
      let urls = `${localStorage.getItem("share_weixin_shareurl")}/addons/shopro/address`
      this.$axios.post(urls,{id: this.id},config).then(res=>{
        if (res.data.code == 1) {
          this.dataList = res.data.data;
          console.log(this.dataList);
        } else {
          Toast(res.data.msg);
        }
      }).catch((err) => {});
    },
  },
};
</script>

<style scoped>
.button {
  height: 10vw;
  line-height: 10vw;
  width: 80vw;
  background: #fe4b20;
  color: #fff;
  text-align: center;
  margin: 20px auto;
  border-radius: 5vw;
}
.box {
  line-height: 30px;
  border-radius: 10px;
  font-size: 14px;
  margin-bottom: 3vw;
}
.box .bottom {
  border-top: 1px solid #eee;
  padding: 2vw 2vw 0 2vw;
  display: flex;
  justify-content: space-between;
}
.box .address {
  margin-bottom: 10px;
}
.bg {
  min-height: 100vh;
  background: #f9f9f9;
}
.list {
  margin: 3vw;
}
.box {
  padding: 2vw;
  background: #fff;
  box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
}
</style>
